<extend name="Public/base" />
<block name="content">
    <table  id="menusTbl">
        <thead>
        <tr>
            <th><input  onclick="selectAll(this)" type="checkbox"></th>
            <th>编号</th>
            <th>菜单名称</th>
            <th>菜单路径</th>
            <th>上级菜单</th>
            <th>分组</th>
            <th>排序</th>
            <th>打开方式</th>
            <th>锁定</th>
            <th>操作</th>
        </tr>
        </thead>
        <tbody>
        <volist name="navs" id="nav">
            <tr id="row_<{$nav.menu_id}>">
            <td><input class="slct" type="checkbox" value="<{$nav.menu_id}>"></td>
            <td><{$nav.menu_id}></td>
            <td><input name="mname" class="a" disabled type="text" value="<{$nav.mname}>"></td>
            <td><input name="url" class="a" disabled type="text" value="<{$nav.url}>"></td>
            <!--<td><input name="up" class="a" disabled style="width:4em;" type="text" value="<{$nav.up}>"></td>-->
             <td>
                 <select  class="a" name="up" id="" disabled>
                     <option <{$nav['up']==0?'selected':null}> value="0" >顶级菜单</option>
                     <volist name="opt" id="v">
                        <option <{$nav['up']==$v['menu_id']?'selected':null}>
                         value="<{$v['menu_id']}>"><{$v.mname}> </option>
                     </volist>
                 </select>
             </td>
            <td><input name="mgroup" class="a" disabled style="width:4em;" type="text" value="<{$nav.mgroup}>"></td>
            <td><input name="msort" class="a" disabled style="width:4em;" type="text" value="<{$nav.msort}>"></td>
            <td>
                <div class="switch tiny">
                    <input onclick="target(this)" value="<{$nav.menu_id}>" id="target_<{$nav.menu_id}>" type="checkbox"  <{$nav['target']?'checked':''}>>
                    <label for="target_<{$nav.menu_id}>"></label>
                </div>
            </td>

            <td>
                <div class="switch tiny">
                    <input onclick="lock(this)" value="<{$nav.menu_id}>" id="lock_<{$nav.menu_id}>" type="checkbox" <{$nav['lock']?'checked':''}> >
                    <label for="lock_<{$nav.menu_id}>"></label>
                </div>
            </td>
            <td>
                <button onclick="edit('row_<{$nav.menu_id}>')" class="button tiny edit">编辑</button>
                <button onclick="save('<{$nav.menu_id}>')" style="display:none;" class="button tiny save">保存</button>
            </td>

        </tr>
        </volist>
        </tbody>
    </table>
    <div>
        <span><{$page}></span>
    </div>
    <a class="button tiny" href="<{:U('addMenu')}>">添加</a>
    <button onclick="unSelect()" class="button tiny">反选</button>
    <button onclick="delLot()" class="button tiny">删除(批量)</button>
    <script>
        function edit(rowid) {
            $('#'+rowid+' .a').prop('disabled',false);
            $('#'+rowid+' .edit').hide();
            $('#'+rowid+' .save').show();
            //console.log('#'+id);exit;
        }
        function save(id) {
            $('#row_'+id+' .a').prop('disabled',true);
            $('#row_'+id+' .edit').show();
            $('#row_'+id+' .save').hide();

            var data = {
                menu_id:id,
                mname:$('#row_'+id+' [name=mname]').val(),
                url:$('#row_'+id+' [name=url]').val(),
                mgroup:$('#row_'+id+' [name=mgroup]').val(),
                msort:$('#row_'+id+' [name=msort]').val(),
                up:$('#row_'+id+' [name=up]').val(),
            }
            console.log(data);

            $.post('<{:U("doEditMenu")}>',data,function (data) {
                if(data.error!==0){
                    alert(data.msg);
                }
            });

        }
        //全选
        function selectAll(obj) {
            $('#menusTbl tbody .slct').prop('checked',$(obj).prop('checked'));
        }
        //反选
        function unSelect() {
            $('#menusTbl tbody .slct').map(function(){
                $(this).prop('checked',!$(this).prop('checked'));
            });
        }

        //批量删除
        function delLot() {//you
            if(!confirm('确认批量删除吗')){
                return;
            }
            var ids = $('#menusTbl tbody .slct:checked').map(function () {
                $(this).parent().parent().remove();
                return $(this).val();
            });
            ids  = ids.get().join();
            $.post('<{:U("doDelMenu")}>',{ids:ids},function (data) {
                alert(data.msg);
            });
        }

        //锁定
        function lock(obj) {
            var id = $(obj).val();
            var lockval = $(obj).prop('checked')?1:0;
            $.post('<{:U("doEditMenu")}>',{menu_id:id,lock:lockval});
        }

        //打开方式
        function target(obj) {
            var id = $(obj).val();
            var targetval = $(obj).prop('checked')?1:0;
            $.post('<{:U("doEditMenu")}>',{menu_id:id,target:targetval},function (data) {
                if(data.error!==0){
                    alert(data.msg);
                }
            });
        }

    </script>

</block>